<template>
	<div>
		<!-- 详情弹窗 -->
		<!-- <a-modal
        v-if="visible"
        :visible="visible"
        :title="modalTitle"
        @ok="addOrder"
        @cancel="closeModal('visible')"
        okText="保存"
        width="60%"
      > -->
		<a-button type="plain" @click="toList" class="d-a-center" style="margin-bottom: 15px">返回</a-button>
		<a-form :model="form" :rules="rules1" :labelCol="labelCol1" :wrapper-col="wrapperCol" ref="formRef">
			<a-form-item label="优惠名称" name="ticketName">
				<a-input placeholder="请输入标题" v-model:value="form.ticketName" allow-clear maxlength="10"></a-input>
			</a-form-item>
			<a-form-item label="参与人群" name="joinCrowd">
				<a-radio-group v-model:value="form.joinCrowd" @change="handleJoinCrowd">
					<a-radio v-for="item in isAttestStatusList" :value="item.id"
						:key="item.id">{{ item.name }}</a-radio>
					<!--  @focus="handleJoinFocus" -->
				</a-radio-group>
			</a-form-item>
			<a-form-item label="发放形式" name="grantShape">
				<a-radio-group v-model:value="form.grantShape">
					<!--  @change="handleGrantShape" -->
					<template v-if="form.joinCrowd == 2 || form.joinCrowd == 3">
						<a-radio v-for="(item, index) in fangType1" :value="item.id"
							:key="item.id">{{ item.name }}</a-radio>
					</template>

					<template v-else>
						<a-radio v-for="(item, index) in fangType" :value="item.id"
							:key="item.id">{{ item.name }}</a-radio>
					</template>
				</a-radio-group>
			</a-form-item>
			<a-form-item label="面值" name="faceValueId">
				<a-radio-group v-model:value="form.faceValueId" @change="changeFace">
					<a-row>
						<a-col :span="12" v-for="(item, index) in money" :key="item.id">
							<a-radio :value="item.id">{{ item.name }}
								<a-input @mousedown="form.faceValueId = 1" :disabled="index == 1" v-if="index == 0"
									style="width: 180px" :min="0.01" :max="1000" placeholder="0.01-100000的数字"
									v-model:value="form.faceValueSum1" allow-clear suffix="元"></a-input>
								<a-input v-if="index == 1" @mousedown="form.faceValueId = 2" :disabled="index == 0"
									style="width: 180px" placeholder="1-99的数字" v-model:value="form.faceValueSum2"
									allow-clear suffix="折"></a-input>
							</a-radio>
						</a-col>
					</a-row>
				</a-radio-group>
			</a-form-item>
			<a-form-item label="使用条件" name="useTypeId">
				<a-radio-group v-model:value="form.useTypeId" @change="changeUse">
					<a-radio v-for="(item, index) in options" :value="item.id" :key="item.id">{{ item.name }}
						<a-input @mousedown="form.useTypeId = 2" :min="0.01" :max="100000" v-if="index == 1"
							:disabled="index == 0" style="width: 240px" placeholder="0.01-100000的数字"
							v-model:value="form.useAstrict" allow-clear suffix="可使用"></a-input>
					</a-radio>
				</a-radio-group>
			</a-form-item>

			<a-form-item label="使用时间" :labelCol="labelCol2" name="useTimeId">
				<a-radio-group v-model:value="form.useTimeId" v-if="form.joinCrowd == 2">
					<div v-for="(item, index) in useOptions1" :key="item.id" style="margin-bottom: 10px">
						<a-radio :value="item.id" class="spe">{{ item.name }}

							<!--实际上是 form.startTime form.endTime -->
							<a-input style="width: 200px" @mousedown="form.useTimeId = 2" placeholder="领取后多少天内有效"
								v-model:value="form.useEndDays" allow-clear suffix="天"></a-input>
							<!-- @input.prevent="handleReg" -->
						</a-radio>
					</div>
				</a-radio-group>
				<a-radio-group v-model:value="form.useTimeId" v-else @change="changeTime">
					<div v-for="(item, index) in useOptions" :key="item.id" style="margin-bottom: 10px">
						<a-radio :value="item.id" class="spe">{{ item.name }}
							<!-- 如果发放形式是主动领取，则没有范围选择 -->
							<a-range-picker v-if="index == 0" v-model:value="form.value3" format="YYYY-MM-DD HH:mm:ss"
								@change="panelChange" value show-time />
							<!--实际上是 form.startTime form.endTime -->
							<a-input v-if="index == 1" style="width: 200px" @mousedown="form.useTimeId = 2"
								placeholder="领取后多少天内有效" v-model:value="form.useEndDays" allow-clear
								suffix="天"></a-input>
						</a-radio>
					</div>
				</a-radio-group>
			</a-form-item>
			<!-- 只有主动领取才有 -->
			<a-form-item label="发行数量" name="sendNumber" v-if="form.grantShape == 2">
				<a-input placeholder="请输入大于0的正整数，0为无限制" v-model:value="form.sendNumber" allow-clear
					suffix="张"></a-input>
			</a-form-item>
			<!-- <a-form-item label="每人限领" name="limitNeck">
        <a-input
          placeholder="请输入大于0的正整数"
          v-model:value="form.limitNeck"
          allow-clear
          suffix="张"
        ></a-input>
      </a-form-item> -->
			<a-form-item label="服务范围" name="scope">
				<a-radio-group v-model:value="form.scope" @change="handleJoinService">
					<a-radio v-for="item in serviceOptions" :value="item.id" :key="item.id">{{ item.name }}</a-radio>
				</a-radio-group>
			</a-form-item>
			<!-- 如果是新用户，则需要这个 -->
			<a-form-item label="优惠标题" name="title" v-if="form.joinCrowd == 2">
				<a-input placeholder="请输入标题" v-model:value="form.title" allow-clear maxlength="20"></a-input>
			</a-form-item>
			<a-form-item label="优惠描述" name="desc" v-if="form.joinCrowd == 2">
				<a-input placeholder="请输入描述" v-model:value="form.desc" allow-clear maxlength="20"></a-input>
			</a-form-item>
			<a-form-item label="使用说明" name="useExplain">
				<a-textarea v-model:value="form.useExplain" placeholder="请输入使用说明"
					:auto-size="{ minRows: 2, maxRows: 5 }" />
			</a-form-item>
			<a-row>
				<!-- 确定和取消 -->
				<a-col :span="4" :offset="7">
					<a-button type="info" v-if="cancelText == '返回'" class="d-a-center"
						@click="handleCancel">{{ cancelText }}</a-button>
					<a-button type="info" v-else @click="jujue" class="d-a-center">{{
            cancelText
          }}</a-button>
				</a-col>
				<a-col v-if="cancelText == '拒绝' && id > 0" :span="4">
					<a-button type="primary" @click="tongguo()" class="d-a-center">通过</a-button>
				</a-col>
				<a-col :span="3" :offset="1">
					<a-button type="primary" v-if="id < 1" @click="handleSubmit" class="d-a-center">保存</a-button>
				</a-col>
			</a-row>
		</a-form>
		<!-- </a-modal> -->
		<!-- 自定义用户弹框 -->
		<a-modal :visible="userVisible" title="用户筛选列表" @ok="addUser" @cancel="closeModal('userVisible')" okText="确定"
			cancelText="取消" width="70%" :maskClosable="false">
			<a-form style="padding-top: 20px" :model="form" :hideRequiredMark="true" :labelCol="labelCol1"
				:wrapper-col="wrapperCol">
				<a-row :gutter="10">
					<a-col :span="8">
						<a-form-item name="nick" label="用户名">
							<a-input v-model:value="formUser.userName" placeholder="请输入用户名"></a-input>
						</a-form-item>
					</a-col>
					<a-col :span="8">
						<a-form-item name="userId" label="用户ID">
							<a-input v-model:value="formUser.userId" placeholder="请输入用户ID"></a-input>
						</a-form-item>
					</a-col>
				</a-row>
				<a-row :gutter="16">
					<!-- <a-col :span="5" :lg="5" :md="7" :xs="8">
            <a-form-item label="地理位置">
              <a-input
                v-model:value="form.mobile"
                placeholder="请输入地理位置"
              ></a-input>
            </a-form-item>
          </a-col> -->
					<a-col :span="8">
						<a-form-item label="消费金额(元)">
							<a-input style="width: 50px" v-model:value="formUser.smallCostFigure"></a-input>—
							<a-input style="width: 50px; display: inline-block"
								v-model:value="formUser.bigCostFigure"></a-input> </a-form-item></a-col>
					<a-col :span="8">
						<a-form-item label="认证状态">
							<a-select ref="select" v-model:value="formUser.attestStatus" style="width: 120px"
								@focus="focus" @change="handleChange" placeholder="请选择实名认证状态">
								<a-select-option v-for="item in isRealNameList" :value="item.id"
									:key="item.id">{{ item.name }}</a-select-option>
							</a-select>
						</a-form-item>
					</a-col>

					<a-col :span="2" :xs="4" :lg="2" :offset="1">
						<a-button type="primary" @click="handleSearch" class="d-a-center">搜索</a-button>
					</a-col>
					<!-- <a-col :span="3" :offset="1">
            <a-button type="primary" @click="openDrawer">高级筛选</a-button>
          </a-col> -->
				</a-row>
			</a-form>
			<a-table :columns="columns" :data-source="personlist" bordered rowKey="id" :loading="loading"
				:pagination="pagination" @change="handleTableChangePerson" :row-selection="rowSelectionPerson"
				:scroll="{ y: 540 }">
				<template #attestStatus="{ record }">
					<div>{{ ["未实名", "已实名"][record.attestStatus] }}</div>
				</template>
			</a-table>
		</a-modal>
		<!-- 自定义服务弹框 -->
		<a-modal :visible="serveVisible" title="服务筛选列表" @ok="addServe" @cancel="closeModal('serveVisible')" okText="确定"
			cancelText="取消" width="70%" :maskClosable="false">
			<a-table :columns="serviceColums" :data-source="serviceList" :row-key="
          (record, index) => {
            return parseInt(record.id);
          }
        " bordered :loading="loading" :pagination="pagination" @change="handleTableChange"
				:row-selection="rowSelection" :scroll="{ y: 540 }">
			</a-table>
		</a-modal>
		<!-- 拒绝原因 -->
		<a-modal :visible="storeVisible" @ok="associateStore" @cancel="storeVisible = false" okText="确定">
			<a-form ref="storeFormRef" :rules="rules1">
				<a-form-item label="
拒绝原因" name="consumableLists">
					<a-input v-model:value="denyCause" placeholder=""></a-input>
				</a-form-item>
			</a-form>
		</a-modal>
	</div>
</template>
<script>
	import {
		reactive,
		ref,
		computed,
		createVNode,
		watch,
		toRefs,
		unref,
		toRaw,
		isReactive,
		toRef,
		onMounted,
	} from "vue";
	import {
		useRoute
	} from "vue-router";
	import router from "@/router/index.js";
	import {
		isAttestStatusList,
		serviceOptions,
		useOptions,
		useOptions1,
		options,
		fangType,
		fangType1,
		money,
		isRealNameList,
	} from "@/utils/dict.js";
	import {
		CheckOutlined,
		EditOutlined,
		ExclamationCircleOutlined,
		QuestionCircleOutlined,
	} from "@ant-design/icons-vue";
	import {
		uploadPicture
	} from "@/api/service/index.js";
	import {
		Modal,
		message
	} from "ant-design-vue";
	import {
		PlusOutlined
	} from "@ant-design/icons-vue";
	import * as api from "@/api/market/index.js";
import { useModal } from '@/hooks'

	export default {
		setup() {
			const route = useRoute();
			const searchRef = ref("");
			const formRef = ref("");

			const data = reactive({
				flag: false,
				id: -1,
				serviceList: [],
				personlist: [],
				loading: true,
				visible: false,
				detaiList: [],
				consumables: [], //默认绑定ID即可
				statusAct: 0,
				searchForm: {},
				typeList: [],
				form: {},
				value: [], //分类-这个远程加载的数据好像不可以哎
				defaultValue: [],
				detailImage: [],
				isAttestStatusList,
				serviceOptions,
				useOptions,
				useOptions1,
				options,
				fangType,
				fangType1,
				money,
				serveVisible: false,
				userVisible: false,
				// 自定义用户或者服务
				myList: [],
				formUser: {},
				isRealNameList,
				findMakeUserDto: null,
				// 是否checkbox勾选了数据
				selectAll: false,
				userSelectList: [],
				// 是否有筛选条件且全选
				selectUserAll: false,
				selectedRowKeys: [],
				cancelText: "返回",
				storeVisible: false,
				denyCause: "",
			});

			const title = ref(""); //分类名称

			const modalTitle = ref("新增耗材");
			const rules = {
				//  portValue: [{ required: true, message: '请选择端口!', trigger: 'change'}],
				//  inputValue: [{ required: true, message: '请输入搜索内容!', trigger: 'blur'}],
			};
			const rules1 = {
				ticketName: [{
					required: true,
					message: "请输入",
				}, ],
				joinCrowd: [{
					required: true,
					message: "请选择",
				}, ],
				grantShape: [{
					required: true,
					message: "请选择",
				}, ],
				faceValueId: [{
					required: true,
					message: "请选择",
				}, ],
				faceValueSum: [{
					required: true,
					message: "请输入",
				}, ],
				faceValueSum2: [{
					pattern: /^ [1-9]{1}\d{0,2}$/,
					message: "请输入1-99的数字",
				}, ],
				useTypeId: [{
					required: true,
					message: "请选择",
				}, ],
				scope: [{
					required: true,
					message: "请选择",
				}, ],
				// 如果选了2，faceValueSum required 为true
				// 使用时间
				useTimeId: [{
					required: true,
					message: "请选择",
				}, ],
				// limitNeck: [{ required: true, message: "请输入" },{
				//   pattern:/^[1-9]{1}\d{0,10}$/,message: "请输入大于0的整数"
				// }],
				sendNumber: [{
					required: true,
					message: "请输入",
				}, ],
				useExplain: [{
					required: true,
					message: "请输入",
				}, ],
				title: [{
					required: true,
					message: "请输入",
				}, ],
				desc: [{
					required: true,
					message: "请输入",
				}, ],
				// cc: [
				//   { required: true, message: "请输入" },
				//   {
				//     pattern: /([1-9]\d*(\.\d*[1-9])?)|(0\.\d*[1-9])/,
				//     // /^\+?[1-9]\d*$/,
				//     message: "大于0的正整数",
				//     trigger: ["change", "blur"],
				//   },
				// ],
				// ([1-9]\d*(\.\d*[1-9])?)|(0\.\d*[1-9])
				// 大于0的数据

				// value: [{ required: true, message: "请选择耗材分类!" }],
			};

			// 分页器
			const page = reactive({
				pageSize: 10,
				total: 0,
				pageNum: 1,
			});

			const saleStatusOptions = reactive([{
					name: "全部",
					id: "",
				},
				{
					name: "上架",
					id: 0,
				},
				{
					name: "下架",
					id: 1,
				},
			]);
			const consumeOptions = reactive([{
					name: "耗材名称",
					id: 1,
				},
				{
					name: "耗材分类",
					id: 1,
				},
			]);
			const delListId = ref([]); //删除数组ID集合
			const chooseStatus = (status, index) => {
				data.statusAct = index;
				data.searchForm.status = status;
				page.pageNum = 1;
				init();
			};
			onMounted(() => {
				if (route.query.type) {
					if (route.query.type == 2) {
						// 审核
						data.cancelText = "拒绝";
					} else {
						data.cancelText = "返回";
					}
				}
				if (route.query.item) {
					console.log(JSON.parse(route.query.item));
					let obj = JSON.parse(route.query.item);
					data.id = obj.id;

					data.form = {
						...obj,
					};
					if (data.form.faceValueId == 1) {
						data.form.faceValueSum1 = obj.faceValueSum;
					} else {
						data.form.faceValueSum2 = obj.faceValueSum;
					}
					if (obj.startTime && obj.useTimeId == 1) {
						data.form.value3 = [`${obj.startTime}`, `${obj.endTime}`];
					}
				}
			});
			// 查看详情
			const getDetail = () => {};
			// 查询
			const search = () => {
				page.current = 1;
				init();
			};
			const addUser = () => {
				// 如果是全选
				if (data.selectUserAll) {
					// 1 全部 - 2 非全部
					data.findMakeUserDto = {
						selectStatus: 1,
						...data.formUser,
					};
				}
				// console.log(data.myList,'data.myList')
				// 不是全选
				else if (data.myList.length > 0) {
					data.form.userIds = data.myList.join(",");
					data.myList = [];
				} else {
					message.error("请选择至少一条用户数据");
					return;
					// data.form.userIds = data.myList;
					//
				}
				closeModal("userVisible");
			};
			const addServe = () => {
				if (data.myList.length > 0) {
					data.form.serviceIds = data.myList.join(",");
					data.myList = [];
					closeModal("serveVisible");
				} else {
					message.error("请选择至少一条服务数据");
				}
			};
			const serviceColums = [{
					title: "服务项目",
					dataIndex: "name",
					className: "table",
					align: "center",
				},

				{
					title: "服务价格",
					dataIndex: "price",
					className: "table",
					align: "center",
					// sorter: (a, b) => a.price - b.price,
				},
				{
					title: "服务时长(min)",
					dataIndex: "hours",
					className: "table",
					align: "center",
				},
				{
					title: "服务介绍",
					dataIndex: "detail",
					className: "table",
					align: "center",
					ellipsis: true,
				},
			];
			const columns = [{
					title: "用户ID",
					dataIndex: "id",
					className: "table",
					align: "center",
				},
				{
					title: "用户名",
					dataIndex: "nick",
					className: "table",
					align: "center",
					sort: true,
				},
				{
					title: "注册渠道",
					dataIndex: "registSource",
					className: "table",
					align: "center",
				},

				{
					title: "订单数量",
					dataIndex: "countNum",
					className: "table",
					align: "center",
				},
				{
					title: "消费金额",
					dataIndex: "sumPrice",
					className: "table",
					align: "center",
				},
				{
					title: "实名制状态",
					dataIndex: "attestStatus",
					className: "table",
					align: "center",
					slots: {
						customRender: "attestStatus",
					},
				},
				{
					title: "注册日期",
					dataIndex: "registTime",
					className: "table",
					align: "center",
				},
			];
			const panelChange = (date, dateString) => {
				console.log("选择的时间是", dateString);
				data.form.startTime = dateString[0];
				data.form.endTime = dateString[1];
			};
			const handleSubmit = () => {
				// if(data.flag) return
				console.log(data.form, "66666666666");
				formRef.value
					.validate()
					.then(async () => {
						// faceValueId faceValueSum  require
						if (!data.form.faceValueSum1 && data.form.faceValueId == 1) {
							message.error("请输入面值的现金值");
							return;
						}
						if (!data.form.faceValueSum2 && data.form.faceValueId == 2) {
							message.error("请输入面值的折扣值");
							return;
						}
						if (data.form.useTypeId == 2 && !data.form.useAstrict) {
							message.error("请输入使用条件满减规则");
							return;
						}
						// if(data.form.faceValueId==1&&data.form.useTypeId==2 ){
						//   if(data.form.faceValueSum1>data.form.useAstrict){
						//      message.error('满减金额不能小于面值现金')
						//     return
						//   }
						// }
						// useTimeId
						if (data.form.useTimeId == 1 && !data.form.value3) {
							message.error("请选择使用范围");
							return;
						}

						if (data.form.useTimeId == 2 && !data.form.useEndDays) {
							message.error("请输入固定天数");
							return;
						}
						// 特殊数字校验
						// 现金
						if (data.form.faceValueId == 1) {
							if (
								data.form.faceValueSum1 < 0.01 ||
								data.form.faceValueSum1 > 100000
							) {
								message.error("面值的现金区间为0.01-100000！");
								return;
							}
						}
						// 折扣
						if (data.form.faceValueId == 2) {
							let rgx = /^[1-9]{1}\d{0,1}$/;
							if (!rgx.test(data.form.faceValueSum2)) {
								message.error("折扣请输入1-99的整数！");
								return;
							}
						}
						// 固定天数
						if (data.form.useTimeId == 2) {
							let rgx = /^[1-9]{1}\d*$/;
							if (!rgx.test(data.form.useEndDays)) {
								message.error("固定天数请输入正整数！");
								return;
							}
						}
						// 使用条件
						if (data.form.useTypeId == 2) {
							if (data.form.useAstrict < 0.01 || data.form.useAstrict > 1000) {
								message.error("使用条件满减区间为0.01-100000！");
								return;
							}
						}
						// 如果是自定义用户 非全选则userIds>0,或者 findMakeUserDto
						if (data.form.joinCrowd == 3) {
							if (!(data.selectUserAll || data.form.userIds)) {
								message.error("请选择至少一条用户数据");
								return;
							}
						}
						if (data.form.scope == 2) {
							if (!data.form.serviceIds) {
								message.error("请选择至少一条自定义服务");
								return;
							}
						}

						data.form.faceValueSum =
							data.form.faceValueSum1 || data.form.faceValueSum2;
						// if(data.form.useTimeId==1){
						//    data.form.startTime = data.form.value3[0]
						// data.form.endTime = data.form.value3[1]
						// }
						data.form.limitNeck = 1;
						data.flag = true;
						api
							.insertTicket({
								ticket: {
									...data.form,
								},
								findMakeUserDto: data.findMakeUserDto ?
									{
										...data.findMakeUserDto,
									} :
									null,
							})
							.then((res) => {
								console.log(res, 99990000);
								if (res.success) {
									data.flag = false;
									data.findMakeUserDto = null;
									message.success("操作成功");
									router.go(-1);
								} else {
									data.flag = false;
								}
							});
					})
					.catch((e) => {
						data.flag = false;
					});
			};
			const handleCancel = () => {
				console.log("router", router);
				// data.form = {}
				router.go(-1);
				// router.back();
			};
			// 分页器
			const pagination = computed(() => ({
				current: page.pageNum,
				pageSize: page.pageSize,
				pageSizeOptions: ["10", "20", "30"],
				showTotal: (total, range) => {
					return "共" + total + "条";
				},
				total: page.total,
				showQuickJumper: true,
				showSizeChanger: true,
			}));
			// 分页器改变的时候
			const handleTableChange = (pagination, filters, sorter) => {
				console.log(pagination, "当前分页");
				page.pageNum = pagination.current;
				page.pageSize = pagination.pageSize;

				// 请求列表接口
				api
					.findMakeSerives({
						...page,
					})
					.then((res) => {
						// personlist
						data.serviceList = [...res.object.list];
						data.loading = false;
						page.total = res.object.total;
					});
			};
			const handleTableChangePerson = (pagination, filters, sorter) => {
				console.log(pagination, "当前分页");
				page.pageNum = pagination.current;
				page.pageSize = pagination.pageSize;

				// 请求列表接口
				api
					.findMakeUser({
						...page,
						...data.formUser,
					})
					.then((res) => {
						// personlist
						data.personlist = [...res.object.list];
						data.loading = false;
						page.total = res.object.total;
					});
			};

			// 关闭模态框
			const closeModal = (e) => {
				// if(data.myList.length==0){
				//   message.error(`请选择至少一条${e=="userVisible"?'用户':'服务'}数据`);
				//   return
				// }
				// if (e == "userVisible") {
				//   if(data.myList.length == 0){
				//      message.error("请选择至少一条用户数据");
				//     return;
				//   }
				// }
				data[e] = false;
				if (e == "itemVisible") {
					data.itemForm = {};
				}
				if (e == "visible") {
					data.form = {};
					data.packageList = [];
					data.itemList = [];
				}
				if (e == "userVisible") {
					data.myList = [];
					// data.form.userIds = data.myList.join(',')
					data.formUser = {};
				}
				data.myList = [];
			};
			// const handleGrantShape = (e) => {
			//   if(e.target.value==2){

			//   } else{

			//   }
			// }
			// 自定义用户
			const handleJoinCrowd = (e) => {
				data.form = {};
				data.form.joinCrowd = e.target.value;
				if (e.target.value == 3) {
					data.userVisible = true;
					data.myList = [];
					data.formUser = {};
					initUser();
				}
			};
			const handleReg = (e) => {
				console.log(data.form.useEndDays, "0000");
			};
			const handleJoinFocus = (e) => {
				if (e.target.value == 3) {
					data.userVisible = true;
					data.selectAll = {};
					data.formUser = {};
					initUser();
				}
			};
			const initUser = () => {
				data.pageNum = 1;
				api
					.findMakeUser({
						...page,
						...data.formUser,
					})
					.then((res) => {
						data.personlist = [...res.object.list];
						data.loading = false;
						page.total = res.object.total;
					});
			};
			const changeTime = (e) => {
				if (e.target.value == 1) {
					data.form.useEndDays = "";
				} else {
					data.form.value3 = ["", ""];
				}
			};
			const changeFace = (e) => {
				if (e.target.value == 1) {
					data.form.faceValueSum2 = "";
				} else {
					data.form.faceValueSum1 = "";
				}
			};
			const changeUse = (e) => {
				if (e.target.value == 1) {
					data.form.useAstrict = "";
				}
			};
			// 自定义服务
			const handleJoinService = (e) => {
				if (e.target.value == 2) {
					data.pageNum = 1;
					data.serveVisible = true;
					rowSelection.value.onSelectNone();
					data.myList = [];
					api
						.findMakeSerives({
							...page,
						})
						.then((res) => {
							// personlist
							data.serviceList = [...res.object.list];
							data.loading = false;
							page.total = res.object.total;
						});
				}
			};
			const handleSearch = () => {
				initUser();
			};
			// 全选反选
			const rowSelection = ref({
				onChange: (selectedRowKeys, selectedRows) => {
					console.log(`selectedRowKeys`, selectedRowKeys);
					console.log(`selectedRows: ${selectedRows}------------------`);
					data.myList = selectedRowKeys;

					// data.userSelectList = selectedRowKeys;
				},
				onSelect: (record, selected, selectedRows) => {
					//console.log(record, selected, selectedRows,'选择多项');
				},
				onSelectNone: () => {},
				onSelectAll: (selected, selectedRows, changeRows) => {
					// 数组项
				},
			});

			const toList = () => {
				console.log("router", router);
				router.back();
			};

			const rowSelectionPerson = ref({
				onSelectNone: () => {},
				checkStrictly: false,
				onChange: (selectedRowKeys, selectedRows) => {
					console.log(`selectedRowKeys: ${selectedRowKeys}`);
					console.log(`selectedRows: ${selectedRows}------------------`);
					data.myList = selectedRowKeys;
					debugger;
					if (selectedRowKeys.length < 10) {
						data.selectUserAll = false;
					}
				},
				onSelect: (record, selected, selectedRows) => {
					//console.log(record, selected, selectedRows,'选择多项');
				},
				onSelectAll: (selected, selectedRows, changeRows) => {
					if (Object.keys(data.formUser).length > 0) {
						data.selectUserAll = selected;
						data.myList = selectedRows;
					}
				},
			});
			const tongguo = () => {
				const {closeModal} = useModal.confirm({
					title: () => "确认通过此优惠券上架审核吗?",
					icon: () => createVNode(QuestionCircleOutlined),
					onOk: async () => {
						let res = await api.ticketAudit({
							id: data.form.id,
							refuse: 1,
						});
						if (res.success) {
							message.success("操作成功");
							router.go(-1);
							closeModal()
						}
					},

					class: "test",
				});
			};
			const jujue = () => {
				data.storeVisible = true;
			};

			const associateStore = async () => {
				if (!data.denyCause) {
					message.error("请输入原因");
					return;
				}
				data.storeVisible = false;
				let res = await api.ticketAudit({
					id: data.form.id,
					refuse: 2,
					refuseReason: data.denyCause,
				});
				if (res.success) {
					message.success("操作成功");
					router.go(-1);
				}
			};

			const methods = {
				reset() {
					data.searchForm = {};
					page.pageNum = 1;
					init();
				},
			};
			return {
				toList,
				...toRefs(data),
				...methods,
				saleStatusOptions,
				consumeOptions,
				searchRef,
				modalTitle,
				formRef,
				rules,
				rules1,
				columns,
				serviceColums,
				pagination,
				title,
				labelCol: {
					style: {
						width: "150px",
					},
				},
				labelCol1: {
					style: {
						span: 4,
						offset: 4,
					},
				},
				labelCol2: {
					style: {
						span: 4,
					},
				},
				wrapperCol: {
					span: 20,
				},
				// handleTableChange,
				// handleGrantShape,
				handleJoinCrowd,
				handleSearch,
				initUser,
				handleJoinService,
				search,
				jujue,
				associateStore,
				// add,
				// del,
				// save,
				// cancel,
				// edit,
				rowSelection,
				// listDel,
				// changeStack,
				chooseStatus,
				// Typename,
				// loadData,
				// uploadDetail_image,
				closeModal,
				handleCancel,
				handleSubmit,
				handleTableChange,
				handleTableChangePerson,
				// 保存所选自定义选项
				addServe,
				addUser,
				handleJoinFocus,
				panelChange,
				handleReg,
				rowSelectionPerson,
				changeTime,
				changeFace,
				changeUse,
				tongguo,
			};
		},

		components: {
			CheckOutlined,
			EditOutlined,
			ExclamationCircleOutlined,
			QuestionCircleOutlined,
			PlusOutlined,
		},
	};
</script>

<style scoped lang="less">
	.act {
		color: #2a9d8f;
	}

	.ant-calendar-picker-input {
		padding-left: 10rpx;
		margin-left: 10rpx;
	}

	.ant-calendar-picker {
		margin-left: 20px !important;
	}

	.spe {
		.ant-input-affix-wrapper {
			margin-left: 20px !important;
		}
	}

	.ant-form-item-label {
		font-size: 24px !important;
		font-weight: 500;
	}
</style>